Skip to content

fix(card): card was not responsive#144

Merged
MGREMY merged 1 commit intomainfrom
fix/card_not_responsive
Dec 3, 2025
Merged

fix(card): card was not responsive#144
MGREMY merged 1 commit intomainfrom
fix/card_not_responsive

Conversation

@MGREMY
Copy link
Collaborator

@MGREMY MGREMY commented Dec 3, 2025 •
edited by coderabbitai bot
Loading

PR Checklist

Please check if your PR fulfills the following requirements:

  • Docs have been added/updated (for bug fixes/features)

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no API changes)
  • Build related changes
  • CI-related changes
  • Documentation content changes
  • Other... Please describe:

Issue Number

Issue Number: #143

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

Summary by CodeRabbit

  • Style
    • Updated card sizing to use max-width constraints instead of fixed width utilities, improving responsive behavior.
    • Adjusted horizontal card image layout to use left-rounded corners and max-width styling for better visual balance and consistency.

✏️ Tip: You can customize this high-level summary in your review settings.

@vercel
Copy link

vercel bot commented Dec 3, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
flowbite-angular Ready Ready Preview Comment Dec 3, 2025 8:24pm
flowbite-angular-storybook Ready Ready Preview Comment Dec 3, 2025 8:24pm

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 3, 2025 •
edited
Loading

Caution

Review failed

The pull request is closed.

Walkthrough

Card theme size utilities were changed from fixed width classes to max-width classes, and the Storybook card example image styling was switched from top-rounded/horizontal sizing to left-rounded/max-width constraints for a vertical layout.

Changes

Cohort / File(s) Summary
Storybook card story example
apps/storybook/src/card.component.stories.ts		 Changed CardOrientationStory image element classes from a top-rounded, fixed-height horizontal layout (rounded-t-lg h-96) to a left-rounded image with max-width constraints (rounded-l-lg max-w-24 md:max-w-48) for vertical orientation.
Card component themes
libs/flowbite-angular/card/src/card-content/theme.ts,
libs/flowbite-angular/card/src/card/theme.ts		 Replaced width utility class strings (w-xs, w-sm, w-md, w-lg, w-xl) with corresponding max-width utilities (max-w-xs, max-w-sm, max-w-md, max-w-lg, max-w-xl) in size mappings. No signature or type changes.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

  • Check theme mappings for consistency and rendering across responsive breakpoints.
  • Verify Storybook visual reflects intended vertical/left-image layout and that class names match the CSS framework version.

Possibly related PRs

Poem

🐰 I swapped the widths for room to grow,
Left-rounded photos in tidy row,
Max-width whispers, layouts sing,
Cards stand taller, light on spring,
A happy hop for CSS flow 🎨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check ✅ Passed The title clearly describes the main change: fixing card responsiveness by switching from fixed width to max-width utility classes.
Description check ✅ Passed The PR description includes all required sections (checklist, PR type, issue number, breaking changes) with appropriate selections and linked issue #143.
📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7ec0624 and c5d121d.

📒 Files selected for processing (3)
  • apps/storybook/src/card.component.stories.ts (1 hunks)
  • libs/flowbite-angular/card/src/card-content/theme.ts (1 hunks)
  • libs/flowbite-angular/card/src/card/theme.ts (1 hunks)

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@MGREMY MGREMY changed the title fix(card): card wan not responsive fix(card): card was not responsive Dec 3, 2025
@MGREMY MGREMY force-pushed the fix/card_not_responsive branch from 7ec0624 to c5d121d Compare December 3, 2025 20:21
@MGREMY MGREMY merged commit 614e826 into main Dec 3, 2025
5 of 7 checks passed
@MGREMY MGREMY deleted the fix/card_not_responsive branch December 3, 2025 20:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@MGREMY